<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:pe="http://primefaces.org/ui/extensions"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:fn="http://java.sun.com/jsp/jstl/functions">
    <ui:composition template="/layout/masterPageNotHeaderSearch.xhtml">
        <ui:define name="ui-header">
            <title>#{utilsController.getLanguages("RepairAndCare")}</title>
        </ui:define>
        <ui:define name="ui-content">
            <style>
                .servive-block{
                    padding: 20px 16px;
                }
                .repairCareItem{
                    padding: 20px 16px;
                    text-align: left;
                    background: none;
                    border: none;
                }
                .a-group-item{
                    font-size: 16px;
                    position: relative;
                }
                .a-toggle:after {
                    color: #3498db;
                    content: "";
                    display: inline-block;
                    font-family: FontAwesome;
                    font-size: 17px;
                    font-weight: bold;
                    position: absolute;
                    right: -10px;
                    top: -5px;
                }
                .repair-title{
                    color: #098ae4 !important;
                    font-style: normal;
                    font-weight: 700;
                    line-height: 20px;
                }
                .headerColor{
                    font-size: 28px;
                }
            </style>
            <div class="container content bg-gradient-body">
                <div class="row">
                    <div class="col-md-8">
                        <div class="panel panel-default rounded-2x">
                            <div class="panel-body">
                                <h2 class="headerColor">Service Tips &amp; Advice</h2>
                                <div class="row margin-bottom-10">
                                    <div class="col-md-4 col-sm-6">
                                        <div class="servive-block servive-block-default repairCareItem">
                                            <img src="/resourcesApp/img/repairAndCare/brakesImage.jpg"/>
                                            <h2 class="heading-md repair-title">When Do You Need to Replace Your Brakes?</h2>
                                            <p>Check your owner's manual to see what the manufacturer recommends. 
                                                You might also want to discuss this with a trusted mechanic, who may also suggest replacing the brake fluid.
                                            </p>
                                            <a href="#" class="a-group-item a-toggle">Read more</a>
                                        </div>
                                    </div>
                                    <div class="col-md-4 col-sm-6">
                                        <div class="servive-block servive-block-default repairCareItem">
                                            <img src="/resourcesApp/img/repairAndCare/service-tipsntricks-2.jpg"/>
                                            <h2 class="heading-md repair-title">What Does the Check-Engine Light Mean?</h2>
                                            <p>
                                                There's no one answer for a check-engine light. It might be a sign of something serious, or it might be something easy to fix. Either way, it is not something to be ignored. 
                                            </p>
                                            <a href="#" class="a-group-item a-toggle">Read more</a>
                                        </div>
                                    </div>
                                    <div class="col-md-4 col-sm-6">
                                        <div class="servive-block servive-block-default repairCareItem">
                                            <img src="/resourcesApp/img/repairAndCare/transFluid.jpg"/>
                                            <h2 class="heading-md repair-title">Do You Really Need to Change the Transmission Fluid?</h2>
                                            <p>
                                                Yes, like other vital fluids, transmission fluid deteriorates, especially with hard use, such as frequent stop-and-go city driving, hauling heavy loads, and trailer towing.
                                            </p>   
                                            <a href="#" class="a-group-item a-toggle">Read more</a>
                                        </div>
                                    </div>
                                </div>
                                <p><a href="#" class="a-group-item a-toggle">See All Service Tips &amp; Advice</a></p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="panel panel-default rounded-2x">
                            <div class="panel-body">
                                <h2 class="headerColor">Get your Auto Insurance</h2>
                                <p>
                                    Protect yourself and Protect other by getting your auto insurance.
                                    At CarPro, we offer the most affordable and full coverage insurance, along with AAA service to serve you for Emergency Help on the Road.
                                </p>
                                <p><a class="btn-u rounded-custom-def">Get Your Quote</a> or call us: 888 CarproH</p>
                            </div>
                        </div>
                        <div class="panel panel-default rounded-2x">
                            <div class="panel-body">
                                <h2 class="headerColor">Garage Auto KIM THANH</h2>
                                <p>
                                    Showroom và Xưởng dịch vụ: Số 6, Đường 3/2, Phường 15, Quận 11, TP.HCM
                                    Đt : (84.8) 3866 2222 Fax : (84.8) 3866 2266
                                    Email : ktc@hondaotokimthanh.com.vn
                                    Web : www.hondaotokimthanh.com.vn
                                    Diện tích toàn thể: trên 3250m2
                                    Tổng số nhân viên: 120 người
                                </p>
                                <p style="text-align: right; font-size: 27px; font-weight: normal; font-style: italic; color:#888888; margin-bottom: 0px;">We are certified service</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </ui:define>
    </ui:composition> 
</html>